<template>
  <div>
    <!-- 标题 -->
    <Nav :title="title"></Nav>

    <div class="pImage" v-if="list.data" v-html="list.data.content"></div>
    <!-- 图片说明 -->
    <div class="header-b" v-if="list.recommendList">
      <ul>
        <li v-for="item in list.recommendList" :key="item.id" >
          <img class="img" :src="item.scene_pic_url" alt="" />
          <p>{{ item.title }}</p>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
import { detailaction } from '@/api/topci/topic'
import { useRoute } from 'vue-router'
import { ref } from 'vue'
export default {
  name: 'TopicList',
  setup () {
    const route = useRoute()
    const title = ref('专题')
    const id = ref('')
    const list = ref([])
    id.value = route.query.id
    detailaction({ id: id.value }).then(res => {
      console.log(res)
      list.value = res
    })

    return { id, list, title }
  }
}
</script>

<style lang="scss" scoped>
@import './scss/index.scss'
</style>
